<style scoped>
  .weui-form-preview__hd label, .weui-form-preview__hd em {
    font-size: .9em !important;
  }
  .weui-loadmore_line .weui-loadmore__tips {
    background-color: #eee;
  }
  .rj-cell.max span{
    font-size: 16px;
    padding-right: 20px;
  }
  .rj-cell label {
    color: #333;
    font-size: 14px;
    width: 44%;
    display: inline-block;
    padding: 5px 3%;
    text-align: right;
  }
  .rj-cell span {
    font-size: 14px;
    color: #333;
    display: inline-block;
    width: 50%;
  }
  .rj-cell.note label{
    float: left;
  }
  .rj-cell.note span{
    width: 80%;
    display: inline-block;
  }
  .weui-cells {
    margin-top: 0;
  }
  .weui-cells_form {
    background: #fbfbfb;
  }
  .weui-cell {
    background: #fff;
  }
  .weui-cells__title {
    text-align: left;
  }
  .oitem {
    padding: 3px;
  }
  .hide {
    display: none;
  }
  #acts {
    font-size: 0;
  }
  #acts span {
    font-size: 14px;
  }
  .halfbtn {
    display: inline-block;
    width: 49%;
  }
  .weui-label {
    text-align: left;
  }
  .weui_cell {
    padding: 10px 15px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
  }
  .weui-cell_select {
    padding: 0 15px;
  }


  .weui-panel {
    background: #eee;
  }

  .rj-cont-tit {
    margin: 0;
    border-radius: 0;
  }

  .weui-panel {
    margin-top: 0;
    text-align: left;
  }

  .hd .weui-grid.js_grid {
    font-weight: 600;
  }

  .weui-grid.js_grid {
    width: 25%;
    padding: 10px 1px;
  }

  /*.weui-grid.fir {*/
  /*  width: 20%;*/
  /*}*/
  /*.weui-grid.sec {*/
  /*  width: 15%;*/
  /*}*/
  /*.weui-grid.thr {*/
  /*  width: 20%;*/
  /*}*/
  /*.weui-grid.fou {*/
  /*  width: 15%;*/
  /*}*/
  /*.weui-grid.fiv {*/
  /*  width: 15%;*/
  /*}*/
  .weui-grid__label {
    text-overflow: initial;
  }
  .section {
    margin: 5px;
    border-radius: 5px;
  }


  .weui_uploader_input_wrp {
    float: left;
    position: relative;
    margin-right: 9px;
    margin-bottom: 9px;
    width: 77px;
    height: 77px;
    border: 1px solid #D9D9D9;
  }

  .weui_uploader_hd {
    padding-top: 0;
    padding-right: 0;
    padding-left: 0;
  }

  .weui_uploader_files {
    list-style: none;
  }

  .weui_uploader_input_wrp:before {
    width: 2px;
    height: 39.5px;
  }

  .weui_uploader_input_wrp:before, .weui_uploader_input_wrp:after {
    content: " ";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: #D9D9D9;
  }

  .weui_uploader_input {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }

  .weui_uploader_input_wrp:after {
    width: 39.5px;
    height: 2px;
  }

  .weui_uploader_bd {
    overflow: hidden;
  }

  .weui_cell {
    padding: 10px 15px;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .outstore >>> .weui-uploader_files {
    list-style: none;
    overflow-y: hidden;
  }

  .outstore >>> .weui-uploader_file {
    float: left;
    margin-right: 9px;
    margin-bottom: 9px;
    width: 79px;
    background: no-repeat 50%;
    background-size: cover;
  }

  .weui-cell.fir {
    border-top: 0;
  }

  .help {
    text-align: right;
    padding: 5px;
    font-size: 12px;
    color: #bbb;
  }

  .weui_uploader_input_wrp.inrow {
    width: 30px;
    height: 30px;
    margin: 0;
  }

  .weui_uploader_input_wrp:before {
    height: 19.5px;
  }

  .weui_uploader_input_wrp:after {
    width: 19.5px;
  }

  .weui-uploader_file.inrow {
    margin: 0;
    width: 40px;
  }

  li.weui-uploader_file {
    display: inline-block;
    padding: 3px 5px;
  }

  ul#images {
    text-align: right;
  }
</style>
<template>
  <div class="examine" style="background: #eee;">
    <div class="rj-wrap" style="background: #fff;">
      {{title}}
      <a href="javascript:" @click="$router.back(-1)" style="position: absolute; left: 10px; top: 8px">
        <img src="@/assets/back.png" style="width: 20px" />
      </a>
    </div>
    <!--    主表信息-->
    <div class="weui-form-preview section" style="background: #fff;">
      <div class="weui-form-preview__hd">
        <label class="weui-form-preview__label">合同编号</label>
        <em class="weui-form-preview__value">{{baseInfo.code}}</em>
      </div>
      <div class="weui-form-preview__bd">
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">名称</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.name}}</span>-->
<!--        </div>-->
        <!--        <div class="weui-cell">-->
        <!--          <div class="weui-cell__hd"><label class="weui-label">采收类型</label></div>-->
        <!--          <div class="weui-cell__bd">-->
        <!--            <input class="weui-input" readonly  type="text"  name="" :value="baseInfo.harvestType == 2 ? '临采' : '订单户'">-->
        <!--          </div>-->
        <!--        </div>-->
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">采收主体</label>
          <span class="weui-form-preview__value">{{baseInfo.parta}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">部门</label>
          <span class="weui-form-preview__value">{{baseInfo.departname}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">入库库房</label>
          <span class="weui-form-preview__value">{{baseInfo.srname}}</span>
        </div>
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">质检标准</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.qaname}}</span>-->
<!--        </div>-->
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">供应商</label>
          <span class="weui-form-preview__value">{{baseInfo.supplierName || '无'}}</span>
        </div>
<!--        <template v-if="baseInfo.supplierName">-->
<!--          <div class="weui-form-preview__item">-->
<!--            <label class="weui-form-preview__label">地块</label>-->
<!--            <span class="weui-form-preview__value">{{baseInfo.arealandname}}</span>-->
<!--          </div>-->
<!--          <div class="weui-form-preview__item">-->
<!--            <label class="weui-form-preview__label">开户行</label>-->
<!--            <span class="weui-form-preview__value">{{baseInfo.bank}}</span>-->
<!--          </div>-->
<!--          <div class="weui-form-preview__item">-->
<!--            <label class="weui-form-preview__label">银行账号</label>-->
<!--            <span class="weui-form-preview__value">{{baseInfo.bankcode}}</span>-->
<!--          </div>-->
<!--        </template>-->
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">产品</label>
          <span class="weui-form-preview__value">{{baseInfo.productname}}</span>
        </div>
        <div class="weui-form-preview__item">
          <label class="weui-form-preview__label">规格</label>
          <span class="weui-form-preview__value">{{baseInfo.specificationname}}</span>
        </div>
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">单价</label>-->
<!--          <span v-if="baseInfo.qamaintype == 2" class="weui-form-preview__value">{{attachUnit(baseInfo.price, '元/淀粉含量*吨')}}</span>-->
<!--          <span v-else class="weui-form-preview__value">{{attachUnit(baseInfo.price, '元/吨')}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item" v-if="baseInfo.harvestType == 2">-->
<!--          <label class="weui-form-preview__label">采收数量</label>-->
<!--          <span class="weui-form-preview__value">{{attachUnit(baseInfo.weight, '吨')}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">付款方式</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.paymentmethod == 1 ? '装车付' : '验收付'}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">扣杂方式</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.deducttypeName}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">扣杂标准</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.isdiscountName}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item" v-if="baseInfo.deducttype == 1 || baseInfo.deducttype == 3">-->
<!--          <label class="weui-form-preview__label">扣杂率</label>-->
<!--          <span class="weui-form-preview__value">{{attachUnit(baseInfo.discountrate, '%')}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">状态</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.statusname}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">备注</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.remark}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">操作人</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.createName}}</span>-->
<!--        </div>-->
<!--        <div class="weui-form-preview__item">-->
<!--          <label class="weui-form-preview__label">创建时间</label>-->
<!--          <span class="weui-form-preview__value">{{baseInfo.createTime}}</span>-->
<!--        </div>-->
        <div class="weui-form-preview__item" v-if="baseInfo.files && baseInfo.files.length > 0">
          <label class="weui-form-preview__label">附件</label>
          <a v-for="(item, index) in baseInfo.files" :href="item.url">
            <span class="weui-form-preview__value">{{item.imagename}}</span>
          </a>
        </div>
      </div>
    </div>
<!--    <div class="cellgroup">-->
<!--      <div class="weui-cell fir">-->
<!--        <div class="weui-cell__hd"><label class="weui-label">供应商</label></div>-->
<!--        <div class="weui-cell__bd">-->
<!--          <input type="hidden" name="partb" :value="partb"/>-->
<!--          <input type="hidden" name="supplierName" :value="plantor.name"/>-->
<!--          <model-list-select :list="plantors"-->
<!--                             v-model="partb"-->
<!--                             option-value="userId"-->
<!--                             option-text="nickName"-->
<!--                             placeholder="请选择">-->
<!--          </model-list-select>-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="weui-cell" v-if="baseInfo.type == 2">-->
<!--        <div class="weui-cell__hd"><label class="weui-label">农户库</label></div>-->
<!--        <div class="weui-cell__bd">-->
<!--          <input type="hidden" name="farmerstoreid" :value="farmerroom.guid"/>-->
<!--          <input type="hidden" name="farmerstore" :value="farmerroom.name"/>-->
<!--          <select class="weui-select" v-model="farmerroom">-->
<!--            <option value="" disabled>请选择</option>-->
<!--            <option v-for="(item, index) in farmerRooms" :key="item.guid" :value="item">-->
<!--              {{ item.name }}-->
<!--            </option>-->
<!--          </select>-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="weui-cell weui-cell_select" v-if="baseInfo.type == 1">-->
<!--        <div class="weui-cell__hd"><label class="weui-label">地块</label></div>-->
<!--        <div class="weui-cell__bd">-->
<!--          <select class="weui-select" name="arealandid" v-model="model.arealandid" ref="arealandid">-->
<!--            <option value="" disabled>请选择</option>-->
<!--            <option v-for="(item, index) in arealands" :key="item.guid" :value="item.guid">-->
<!--              {{ item.AName }}-->
<!--            </option>-->
<!--          </select>-->
<!--        </div>-->
<!--      </div>-->
<!--    </div>-->
<!--    <template v-if="model.partb">-->
<!--      <div style="font-size: 0;margin: -6px 0;">-->
<!--        <div class="weui-cells__title" style="display: inline-block; width: 35%;">付款信息</div>-->
<!--        <div style="display: inline-block; width: 55%;text-align: right">-->
<!--          <label for="weuiAgree" class="weui-agree">-->
<!--            <input id="weuiAgree" type="checkbox" checked name="saveFlag" v-model="model.saveFlag" value="1" class="weui-agree__checkbox">-->
<!--            <span class="weui-agree__text">-->
<!--                保存付款信息-->
<!--              </span>-->
<!--          </label>-->
<!--        </div>-->
<!--      </div>-->
<!--      <div class="cellgroup">-->
<!--        <div class="weui-cell">-->
<!--          <div class="weui-cell__hd"><label class="weui-label">开户行</label></div>-->
<!--          <div class="weui-cell__bd">-->
<!--            <input class="weui-input" type="text" name="bank" v-model="plantor.bank"/>-->
<!--          </div>-->
<!--        </div>-->
<!--        <div class="weui-cell">-->
<!--          <div class="weui-cell__hd"><label class="weui-label">银行账号</label></div>-->
<!--          <div class="weui-cell__bd">-->
<!--            <input class="weui-input" type="number" name="bankcode" v-model="plantor.bankcode"/>-->
<!--          </div>-->
<!--        </div>-->
<!--      </div>-->
<!--    </template>-->
    <!--    动态数据-->
    <p style="height: 5px;"></p>
      <div class="weui-cells weui-cells_form section">
      <form action="" method="post" id="formid">
        <div class="weui-cell fir" v-if="!baseInfo.supplierId">
          <div class="weui-cell__hd"><label class="weui-label">供应商</label></div>
          <div class="weui-cell__bd">
            <model-list-select :list="plantors"
                               v-model="plantorId"
                               option-value="id"
                               option-text="name"
                               placeholder="请选择">
            </model-list-select>
          </div>
        </div>
        <div class="weui-cell" :class="baseInfo.supplierId ? 'fir' : ''">
          <div class="weui-cell__hd"><label class="weui-label">附件上传</label></div>
          <div class="weui-cell__ft">
            <div class="weui_uploader_bd">
              <ul class="weui_uploader_files"></ul>
              <div class="weui_uploader_input_wrp inrow">
                <UploadFile3 class="weui_uploader_input" v-on:pushfile="setFile"></UploadFile3>
              </div>
            </div>
          </div>
          <ul class="weui-uploader_files" id="images">
            <li class="weui-uploader_file" v-for="(fil, index) in filenames" @click=delFile(fil,fileids[index])>
              {{fil}}
            </li>
          </ul>
        </div>
        <div class="weui-cell">
          <div class="weui-cell__bd">
            <textarea class="weui-textarea opinion" id="opinion" v-model="opinion" name="opinion" placeholder="请输入意见内容" rows="2"></textarea>
          </div>
        </div>
      </form>
    </div>
    <div class="weui-btn-area">
      <a class="weui-btn weui-btn_primary subbtn" href="javascript:" @click="postForm()">提交</a>
    </div>
  </div>
</template>

<script>
  import wx from 'weixin-js-sdk';
  import SalesOperationLogs7 from '@/components/common/SalesOperationLogs7'
  import ApproveBom from '@/components/common/ApproveBom'
  import UploadFile3 from "@/components/common/UploadFile3";
  import 'vue-search-select/dist/VueSearchSelect.css'
  import { ModelListSelect } from 'vue-search-select'

  export default {
  name: 'Examine39',
  data () {
    return {
      flowid: 39,
      opinion: '',
      openid: localStorage.openid,
      id: '',
      title: '生成货运单',
      nodeid: '',
      annex: '',
      baseInfo: {},
      baseItems: '',
      wxParams: {},
      images: {
        serverId: [],
        srcStr: [],
      },
      refuseflag: '',
      refuseNodes: [],
      orderfiles: [],
      isReady: false,
      filenames: [],
      fileids: [],
      model: {
      },
      plantors: [],
      farmerRooms: [],
      arealands: [],
      plantorId: '',
      plantor: '',
    }
  },
    components: {
      SalesOperationLogs7,
      ApproveBom,
      UploadFile3,
      ModelListSelect
    },
  mounted () {
    //提交操作定位到页面底部
    //$('#bmlogs').css('margin-bottom', this.$refs.actHtml.offsetHeight)

    //$('#opinion').focus();
    this.id = this.$route.query.id;
    // this.nodeid = this.$route.query.nodeid;
    // this.annex = this.$route.query.annex;
    // this.title = this.$route.query.title;
    // this.refuseflag = this.$route.query.refuseflag;
    this.getBaseInfo(this.id);
    if (this.$route.query.status) {
      this.status = this.$route.query.status;
    }
    this.getPlantors();
  },
  watch: {
    'plantorId': function (val) {
      this.plantor = this.plantors.find(item => item.id == val);
    }
  },
  methods: {
    //提交表单数据
    postForm: function () {
      let that = this;
      //表单校验
      if (!this.baseInfo.supplierId && !this.plantor) {
        this.toastText('请选择供应商');
        return false;
      }
      //防止重复提交
      $('.subbtn').attr("disabled",true).css("pointer-events","none");
      //显示提交状态
      $.showLoading("正在提交");
      // let postData = this.serialize2Obj($("#formid").serializeArray());
      let postData = {
        contractid: this.id,
        remark: this.opinion,

      };
      if (!this.baseInfo.supplierId) {
        postData.supplierId = this.plantorId;
        postData.supplierName = this.plantor.name;
      }
      postData.fileIds = this.fileids.join(',');
      // postData = JSON.parse(postData)
      this.axios({
        method: 'post',
        url: '/prod-api/harvest/freightorder/save',
        params: postData
      }).then(response => {
        //恢复提交按钮可点击
        $('.subbtn').attr('disabled', false).css("pointer-events","auto");
        //关闭提交状态
        $.hideLoading();

        if (response.data.code == 200) {
          this.toastSuccess("生成货运单成功");
          this.$router.push({name: 'ForderList2'});
        } else if (response.data.msg) {
          this.toastText(response.data.msg);
        } else {
          this.toastError('系统错误');
        }
      }).catch(function (error) {
        //恢复提交按钮可点击
        $('.subbtn').attr('disabled', false).css("pointer-events","auto");
        //关闭提交状态
        $.hideLoading();
        that.toastError('系统错误');
      });
    },
    getPlantors: function () {
      // this.axios({
      //   method: 'get',
      //   url: '/prod-api/system/user/list',
      //   params: {userType: 1}
      // }).then(response => {
      //   if (response.data.code == 200) {
      //     this.plantors = response.data.rows;
      //   }  else {
      //     this.toastText('获取种植户数据失败');
      //   }
      // });
      this.axios({
        method: 'get',
        url: '/prod-api/organization/supplier/findSupploerlist',
        params: {type: 1}
      }).then(response => {
        if (response.data.code == 200) {
          this.plantors = response.data.data;
        } else {
          this.toastText('获取供应商数据失败')
        }
      });
    },
    getArealands: function() {
      this.axios({
        method: 'get',
        url: '/prod-api/store/arealand/getArealand',
        params: {userid: this.model.partb}
      }).then(response => {
        if (response.data.code == 200) {
          this.arealands = response.data.data;
        } else {
          this.toastText('获取地块数据失败')
        }
      });
    },
    delFile: function (name, id) {
      let that = this;
      $.confirm('确定要删除？', function () {
        that.axios({
          method: 'post',
          url: '/prod-api/common/delete',
          params: {id: id}
        });
        that.fileids = that.fileids.filter(item => {
          return item != id;
        });
        that.filenames = that.filenames.filter(item => {
          return item != name;
        })
      })
    },
    setFile: function (file) {
      this.filenames.push(file.name);
      this.fileids.push(file.id);
    },
    packUnit: function(unit, currency) {
      return unit != undefined && unit != '' ? currency == 2 ? '美元/' + unit : '元/' + unit : '';
    },
    checkCore:function() {
      var u = navigator.userAgent;
      //var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;//g
      var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);   //ios终端
      if (isIOS) {
        return 'ios';
      } else  {
        return 'android';
      }
    },
    getBaseInfo: function (id) {
      this.axios({
        method: 'get',
        url: `/prod-api/harvest/procurementcontract/${id}`,
      }).then(response => {
        if (response.data.code == 200) {
          let data = response.data;
          this.baseInfo = data.data || {};
          this.model.type = this.baseInfo.type;
          this.model.qamainid = this.baseInfo.qamainid;
          // this.baseItems = response.data.items;
        } else if (response != undefined && response.data != undefined && response.data.msg == 'sessionTimeOut') {
          //不不设置提示
        } else {
          this.toastError('系统错误');
        }
        this.isReady = true;
      });
    },


}
}
</script>
